<template>
  <div class="content">
    <div class="gov-sub6">
      <div v-for="item in unitdeviceinfo" :key="item.index">
        
        <div class="gov-sub6-box">
          <div class="gov-title">
            <p>{{item.name}}<i class="gl"></i><i class="gl"></i></p>
          </div>
          <p>
            当前负荷总量：
            <span class="gov-sub6-num">{{item.load||'--'}}</span>kW 
          </p>
          <div class="gov-sub6-temp">
            <div>
              <p>空调平均温度</p>
              <p class="gov-sub6-num">{{item.temperature||'--'}}℃</p>
            </div>
            <div>
              <p>平均设定温度</p>
              <p class="gov-sub6-num">{{item.settemperature||'--'}}℃</p>
            </div>
          </div>
          <div class="gov-sub6-ep">
            <p>设备开启量</p>
            <p>
              <span><img src="~@/assets/light.png" alt=""> {{item.lighton}}</span>
              <span><img src="~@/assets/socket.png" alt=""> {{item.drinkon}}</span>
              <span><img src="~@/assets/ac.png" alt=""> {{item.acon}}</span>
            </p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'governmentF',
  data () {
    return {
      unitdeviceinfo: [],
    }
  },
  mounted: function () {
    this.getData()

  },
  methods: {
    getData: function () {
      this.$http('/vqdisplay/agency/data')
      .then( response => {
        let _data = response.data.body
        console.log(_data)
        this.unitdeviceinfo = _data.unitdeviceinfo
        
      })
    }
  }
}
</script>

<style scoped>
  @import '../../../style/government.css';

</style>